import Vue from 'vue'
import VueRouter from 'vue-router'

import Layout from '@/views/layout/index.vue'
import Login from '@/views/login/index.vue'
import Home from '@/views/home/index.vue'
// 下面是另一种导入写法
const Product = () => import('@/views/product/index.vue')
const List = () => import('@/views/product/list/index.vue')
const Category = () => import('@/views/product/category/index.vue')
const Order = () => import('@/views/order/index.vue')
const OrderList = () => import('@/views/order/list/index.vue')
const OrderCollect = () => import('@/views/order/collect/index.vue')

const Advert = () => import('@/views/advert/index.vue')
const AdvertList = () => import('@/views/advert/list/index.vue')

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    component: Layout,
    children: [
      { path: '/', name: 'home', component: Home },
      {
        path: '/product',
        name: 'product',
        component: Product,
        children: [
          { path: 'list', name: 'list', component: List },
          { path: 'category', name: 'category', component: Category }]
      },
      {
        path: '/order',
        name: 'order',
        component: Order,
        children: [
          { path: 'list', name: 'order-list', component: OrderList },
          { path: 'collect', name: 'order-collect', component: OrderCollect }]
      },
      {
        path: '/advert',
        name: 'advert',
        component: Advert,
        children: [
          { path: 'list', name: 'advert-list', component: AdvertList }]
      }
    ]
  },
  {
    path: '/login', name: 'login', component: Login
  }
]

const router = new VueRouter({
  routes
})

export default router
